import type { MapDataItem } from "./extractModelData";
import { getCachedModelData } from "./extractModelData";

/**
 * 信息窗口颜色配置接口
 */
export interface InfoWindowColorConfig {
  backgroundColor: string; // 信息窗口背景色
  titleColor: string; // 楼盘名称颜色
  priceColor: string; // 价格单位颜色
  priceBgColor: string; // 价格单位背景色
}

/**
 * 信息窗口服务类，负责创建、管理和销毁信息窗口
 */
export class InfoWindowService {
  private TMap: any = null;
  private map: any = null;
  private infoWindows: Map<string, any> = new Map();
  private colorConfig: InfoWindowColorConfig = {
    backgroundColor: "#F36923",
    titleColor: "#ffffff",
    priceColor: "#000000",
    priceBgColor: "#ffffff",
  };

  /**
   * 构造函数
   * @param TMap TMap API实例
   * @param map 地图实例
   */
  constructor(TMap: any, map: any) {
    this.TMap = TMap;
    this.map = map;
  }

  /**
   * 设置信息窗口颜色配置
   * @param config 颜色配置对象
   */
  public setColorConfig(config: Partial<InfoWindowColorConfig>): void {
    console.log("开始设置信息窗口颜色配置");
    this.colorConfig = { ...this.colorConfig, ...config };

    console.log("已更新信息窗口颜色配置:", this.colorConfig);

    // 在微任务队列中执行更新，确保DOM已经更新
    Promise.resolve().then(() => {
      // 立即更新所有已存在的信息窗口
      this.updateAllInfoWindows();
    });
  }

  /**
   * 获取当前颜色配置
   * @returns 当前颜色配置
   */
  public getColorConfig(): InfoWindowColorConfig {
    return { ...this.colorConfig };
  }

  /**
   * 创建信息窗口
   * @param item 模型数据项
   */
  public createInfoWindow(item: MapDataItem): void {
    if (!this.TMap || !this.map || !item) return;

    try {
      const infoWindowId = `${item.id}`;

      // 检查是否已经存在该信息窗口
      if (this.infoWindows.has(infoWindowId)) {
        return;
      }

      // 创建信息窗口
      const infoWindow = new this.TMap.InfoWindow({
        map: this.map,
        position: new this.TMap.LatLng(item.lat, item.lon),
        content: this.generateInfoWindowContent(item),
        offset: { x: 0, y: -10 },
        enableCustom: true,
      });

      // 存储信息窗口实例
      this.infoWindows.set(infoWindowId, infoWindow);

      console.log(`已创建信息窗口: ${item.name || item.id}`);
      console.log("infoWindow", this.infoWindows);
    } catch (error) {
      console.error(`创建信息窗口时出错: ${item.name || item.id}`, error);
    }
  }

  /**
   * 更新所有信息窗口
   */
  private updateAllInfoWindows(): void {
    console.log(
      "开始更新所有信息窗口，当前信息窗口数量:",
      this.infoWindows.size
    );

    let updatedCount = 0;
    let notFoundCount = 0;
    let errorCount = 0;

    // 使用getCachedModelData获取最新的缓存数据
    const currentModelData = getCachedModelData();
    console.log("当前缓存模型数据数量:", currentModelData.length);

    // 保存当前所有信息窗口的ID和位置信息
    const infoWindowPositions = new Map<string, { lat: number; lon: number }>();
    this.infoWindows.forEach((infoWindow, id) => {
      // 确保ID类型匹配，进行字符串和数字的强类型比较
      console.log("当前信息窗口ID:", infoWindow);
      const item = currentModelData.find((item) => String(item.id) === id);
      if (item) {
        infoWindowPositions.set(id, { lat: item.lat, lon: item.lon });
      }
    });

    // 先销毁所有信息窗口
    console.log("先销毁所有信息窗口，准备重建");
    this.destroyAllInfoWindows();

    // 立即重新创建所有信息窗口，使用新的颜色配置
    console.log("开始重建所有信息窗口，应用新的颜色配置");
    infoWindowPositions.forEach((position, id) => {
      // 确保ID类型匹配，进行字符串和数字的强类型比较
      const item = currentModelData.find((item) => String(item.id) === id);

      if (!item) {
        console.warn(`重建时未找到信息窗口ID=${id}对应的模型数据`);
        notFoundCount++;
        return;
      }

      try {
        // 重新创建信息窗口，确保完全应用新的颜色配置
        const infoWindow = new this.TMap.InfoWindow({
          map: this.map,
          position: new this.TMap.LatLng(position.lat, position.lon),
          content: this.generateInfoWindowContent(item),
          offset: { x: 0, y: -10 },
          enableCustom: true,
        });

        // 重新存储信息窗口实例
        this.infoWindows.set(id, infoWindow);
        console.log(`已成功重建信息窗口: ${item.name || item.id}`);
        updatedCount++;
      } catch (error) {
        console.error(`重建信息窗口时出错: ${item.name || item.id}`, error);
        errorCount++;
      }
    });

    console.log(
      `信息窗口更新完成: 成功=${updatedCount}, 未找到数据=${notFoundCount}, 错误=${errorCount}`
    );
  }

  /**
   * 生成信息窗口内容
   * @param item 模型数据项
   * @returns 信息窗口HTML内容
   */
  private generateInfoWindowContent(item: MapDataItem): string {
    const { backgroundColor, titleColor } = this.colorConfig;
    console.log("backgroundColor", backgroundColor);
    console.log("titleColor", titleColor);

    return `<div style="display:inline-block; background-color:${backgroundColor}; color:${titleColor}; font-size:14px; padding:4px 8px; border-radius:4px; position:relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;">
      <span>${item.name || `模型 ${item.id}`}</span>
      ${this.generatePriceContent(item)}
      <button onclick="window.loadThreeJSModel('${item.id}', '${
      item.name || `模型 ${item.id}`
    }', '${item.httpUrl || ""}', ${item.lat}, ${item.lon})" 
              style="margin-left: 8px; padding: 2px 6px; font-size: 12px; background: rgba(255,255,255,0.9); color: #333; border: none; border-radius: 3px; cursor: pointer; transition: all 0.2s ease;">
        查看模型
      </button>
      <div style="position:absolute; bottom:-6px; left:50%; transform:translateX(-50%); width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-top:8px solid ${backgroundColor};"></div>
    </div>`;
  }

  /**
   * 生成价格显示内容
   * @param item 模型数据项
   * @returns 价格HTML内容
   */
  private generatePriceContent(item: MapDataItem): string {
    if (!item.startPrice) {
      return "";
    }

    const unitText = this.getUnitText(item.unit);
    const { priceColor, priceBgColor } = this.colorConfig;

    console.log("priceColor", priceColor);
    console.log("priceBgColor", priceBgColor);

    return `<span style="left: 6px; font-size: 12px; padding: 2px 4px; margin-left: 4px; background: ${priceBgColor}; border-radius: 10px; color: ${priceColor};">
      ${item.startPrice}${unitText}
    </span>`;
  }

  /**
   * 根据unit字段获取显示的单位文本
   * @param unit unit字段值
   * @returns 显示的单位文本
   */
  private getUnitText(unit: string | undefined): string {
    const unitValue = unit || "";

    switch (unitValue) {
      case "w/套":
      case "1":
        return "w/套";
      case "w/㎡":
      case "2":
        return "w/㎡";
      case "y/㎡":
      case "3":
        return "y/㎡";
      default:
        return "y/㎡";
    }
  }

  /**
   * 销毁信息窗口
   * @param infoWindowId 信息窗口ID
   */
  public destroyInfoWindow(infoWindowId: string): void {
    const infoWindow = this.infoWindows.get(infoWindowId);
    if (infoWindow) {
      infoWindow.close();
      this.infoWindows.delete(infoWindowId);
    }
  }

  /**
   * 销毁所有信息窗口
   */
  public destroyAllInfoWindows(): void {
    if (this.infoWindows.size === 0) return;

    this.infoWindows.forEach((windowInstance, id) => {
      if (windowInstance) {
        windowInstance.close();
        console.log(`销毁信息窗口: ${id}`);
      }
    });

    this.infoWindows.clear();
    console.log(`所有信息窗口已销毁，当前数量: ${this.infoWindows.size}`);
  }

  /**
   * 获取信息窗口数量
   * @returns 信息窗口数量
   */
  public getInfoWindowCount(): number {
    return this.infoWindows.size;
  }

  /**
   * 更新地图实例引用
   * @param map 新的地图实例
   */
  public updateMapInstance(map: any): void {
    this.map = map;
    // 当地图实例更新时，销毁所有信息窗口
    this.destroyAllInfoWindows();
  }

  /**
   * 销毁服务
   */
  public destroy(): void {
    this.destroyAllInfoWindows();
    this.infoWindows.clear();
    this.map = null;
    this.TMap = null;
    // this.modelService = null; // 该行因类型不存在而注释掉
  }
}
